<template>
	<!--远程充电页面-->
	<view class="community">
		<view class="head_bg" style="position: relative;"></view>
		<view class="big_box" style="margin-top:-190rpx;">
			<view class="guide_box margin-xl">
				<view class="margin-top-sm bgys text-center flex">
					<view class="align-center" style="margin:0 auto">
					  <image @tap="ChooseImage" src="../../../common/img/tianjia.png" style="width:200rpx;height: 200rpx;"></image>
					  <view class="text-grey">点击识别二维码</view>
					</view>
				</view>	
				<!-- <view class="margin-top-sm text-center bg-img flex bg-white" v-else :style="[{ backgroundImage:'url(' +imgurl+ ')' }]" style="height:500rpx;">
					<view class="align-center" style="margin:0 auto">
					  <image @tap="ChooseImage" src="../../../common/img/tianjia.png" style="width:200rpx;height: 200rpx;"></image>
					  <view class="text-grey">上传插座图片</view>
					</view>
				</view>	 -->
			</view>
		</view>
		<view class="margin-left-xl margin-right-xl" style="margin-top:20rpx;">
			<view class="text-black text-bold text-lg">充电说明：</view>
			<view class="text-grey">
				当您在充电桩边上，无法使用网络，别着急。可以使用远程充电。具体步骤如下：
			</view>
			<view class="text-grey">
				1，将您的爱车插到充电桩的插头
			</view>
			<view class="text-grey">
				2，拍摄您插入的充电桩的二维码（清晰、无遮挡）
			</view>
			<view class="text-grey">
				3，进入公众号选择远程充电
			</view>
			<view class="text-grey">
				4，上传您拍的插座二维码
			</view>
			<view class="text-grey">
				5，付款充电
			</view>
		</view>
		<!-- <button type="button" class="add_text_btn margin-top-lg" form-type="submit" @tap="tocharge()">开始充电</button> -->
	</view>
</template>

<script>
	import { pathToBase64, base64ToPath } from '../../../components/js_sdk/gsq-image-tools/image-tools/index.js'
	import wx from '@/api/jweixin-1.6.0.js'
	export default {
		data() {
			return {
				equipment_number:'',//设备编号
				src:'',
				imgurl:''
			}
		},
		onLoad() {
			let that = this;
			uni.request({
				url: 'http://evcssappapi.yushengkeji.cn/user/v1/GetSign',
				data: {
					"url": encodeURIComponent(location.href.split('#')[0]),
					api: ['scanQRCode'], //调用的方法去接口列表里找
				},
				method: "post",
				success: function(res) {
					console.log("res=" + JSON.stringify(res));
					var wxData = res.data.data
					that.wx_sanCode(wxData)
				}
			
			})
		},
		onShow() {
			// let openid = uni.getStorageSync("openid");
			// if(openid){
			// 	let islogin = uni.getStorageSync("islogin");
			// 	if(islogin=='1')
			// 	{
			// 		uni.navigateTo({
			// 			url: '/pages/user/login/login?type=yuancheng'
			// 		})
			// 	}
			// }
			// else{
			// 	this.getwxinfo() 
			// }
		},
		methods: {
			getWeiXin() {
				//跳转
				window.location.href = 'http://evcssappapi.yushengkeji.cn/user/v1/getweixincode'
			},
			getwxinfo() {
				let openid = uni.getStorageSync("openid");
				if (openid) {
					let that = this;
					that.http.postJSON({
						url: 'user/v1/login',
						data: {
							"openid": openid,
						}
					}).then((res) => {
						// uni.showToast({
						// 	title:'res='+JSON.stringify(res),
						// 	icon:'none'
						// })
						if (res.data.code == 0 && res.data.success == true) {
							uni.showToast({
								title: '登录成功!',
								icon: 'none'
							})
							uni.setStorageSync("token", res.data.data.token);
							this.menuauthority = res.data.data.menuauthority
							uni.setStorageSync("menuauthority", this.menuauthority);
							/* uni.showToast({
								title:'获取授权码!2222',
								icon:'none'
							}) */
							this.getuserinfo();
						} else {
							this.getWeiXin();
						}
					})
				} else {
					this.getWeiXin();
				}
			},
			//进入页面先判断是否充电。 -1 没有充电。      0正在充电。   
			getdata(){
				let that=this;
				that.http.tokenreq({
					url: 'user/v1/chargingstatus',
				}).then((res) => {
					let e=res.data;
					console.log("e="+JSON.stringify(e));
					if(e.code==0 && e.success){
						uni.navigateTo({
							url: '/pages/user/charging/chargingnow'
						})
					}
				})
			},
			wx_sanCode: function(wxData) {
				wx.config({
					debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
					appId: wxData.AppId, // 必填，公众号的唯一标识
					timestamp: wxData.Timestamp, // 必填，生成签名的时间戳
					nonceStr: wxData.NonceStr, // 必填，生成签名的随机串
					signature: wxData.Signature, // 必填，签名
					jsApiList: ['scanQRCode'] // 必填，需要使用的JS接口列表
				})
				wx.ready(function() {
					// config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
					wx.checkJsApi({
						jsApiList: ['scanQRCode'], // 需要检测的JS接口列表，所有JS接口列表见附录2,
						success: function(res) {
							console.log('返回信息')
							console.log(res)
							// 以键值对的形式返回，可用的api值true，不可用为false
							// 如：{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
						}
					});
				});
				wx.error(function(res) {
					// config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
					console.log(res, '接口验证失败')
				});
			
			},
			ChooseImage() {
				let that=this;
				wx.scanQRCode({
					needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
					scanType: ["qrCode", "barCode"], // 可以指定扫二维码还是一维码，默认二者都有
					success: function(res) {
						var result = res.resultStr; // 当needResult 为 1 时，扫码返回的结果
						if(result.indexOf("http") == 0) {
						   let src=result.split("?")[1];
						   let erm=src.split("=")[1];
						   that.tocharge(erm);
						}else{
							that.tocharge(result);
						}
					}
				});
			},
			tocharge(scode){
				uni.navigateTo({
					url: '/pages/ceshi/device/device?scode=' + scode
				})
			},
		}
	}
</script>
<style>
   page{
	   background-color:#FFFFFF;
   }
   .bgys{
	   background-color:#E3EBFE;
	   height:400rpx;
   }
</style>
